import React, { Component } from 'react'
import {withRouter} from 'react-router-dom'

class Header extends Component {
  // 点击按钮前进
  forward = ()=>{
    this.props.history.goForward()
  }

  // 点击按钮回退
  back = ()=>{
    this.props.history.goBack()
  }

  // 点击按钮前进2步
  forwardTwo = ()=>{
    this.props.history.go(2)
  }
  render() {
    console.log("Header: ",this.props)
    return (
      <div className="row">
        <div className="col-xs-offset-2 col-xs-8">
          <div className="page-header">
            <h2>React Router Demo</h2>
            <button onClick={this.forward}>forward</button>&nbsp;
            <button onClick={this.back}>back</button>&nbsp;
            <button onClick={this.forwardTwo}>forward 2 step</button>
          </div>
        </div>
      </div>
    )
  }
}

export default withRouter(Header)
